<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="back/common/common_resource :: resources"/>
    <title>Title</title>
    <script th:src="@{/js/back/perm_list.js}"></script>
    <th:block th:remove="all">
        <link rel="stylesheet" href="/static/css/bootstrap-3.1.1.min.css">
        <link rel="stylesheet" href="/static/css/font-awesome.css">
    </th:block>
</head>
<body class="hold-transition skin-blue sidebar-mini fixed">
<div class="wrapper">
    <div class="content-wrapper" style="margin-left: 0;padding-top: 0">
        <!-- Main content -->
        <section class="content">
            <div class="row">
                <div class="col-xs-12">
                    <div class="box">
                        <div class="box-header">
                            <h3 class="box-title">权限列表</h3>
                        </div>
                        <!-- /.box-header -->
                        <div class="box-body">
                            <div class="container-fluid" style="margin-bottom: 15px">
                                <div class="col-md-8">
                                    <div class="box-tools">
                                        <button id="perm-add-btn"
                                                class="button button-small button-3d button-highlight button-rounded"
                                                style="font-size: 15px">添加权限
                                        </button>
                                    </div>
                                    <div class="table-responsive">
                                        <table id="role-table" class="table table-bordered table-hover">
                                            <thead>
                                            <tr>
                                                <th>ID</th>
                                                <th>描述</th>
                                                <th>内容</th>
                                                <th>操作</th>
                                            </tr>
                                            </thead>
                                            <tbody>
                                            <tr th:each="perm:${perms}" th:id="'tr-'+${perm.id}">
                                                <td th:text="${perm.id}"></td>
                                                <td th:text="${perm.name}"></td>
                                                <td th:text="${perm.value}"></td>
                                                <td>
                                                    <button th:id="'del-'+${perm.id}" class="btn btn-sm btn-danger"><i
                                                            class="fa fa-trash-o"></i>&nbsp;删除
                                                    </button>
                                                </td>
                                            </tr>
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    </div>
</div>
<div class="modal fade" id="add-perm-modal" tabindex="-1" role="dialog" aria-labelledby="addRoleLabel"
     aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="addRoleLabel">
                    <span class="fa fa-edit"></span>
                    <strong>添加权限</strong></h4>
            </div>
            <form th:action="@{/admin/perm/permission}" role="form" id="add-perm-form" method="post">
                <div class="modal-body">
                    <div class="row">
                        <div class="form-group">
                            <label for="name">权限描述：</label>
                            <input type="text" class="form-control" id="name" name="name"
                                   placeholder="请输入角色描述">
                        </div>
                    </div>
                    <div class="row">
                        <div class="form-group" style="margin-bottom: 0">
                            <label for="value">权限内容：</label>
                            <input type="text" class="form-control" id="value" name="value"
                                   placeholder="请输入角色内容">
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                    <button id="add-role-sub-btn" class="btn btn-primary">提交</button>
                </div>
            </form>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>
</body>
</html>